<template>
  <!-- 软件岗位薪资饼图 -->
  <div class="barChart"></div>
</template>

<script>
import { getTestDataBar } from "@/api/page2Api";
export default {
  name: "",
  data() {
    return {
        data: []
    };
  },
  methods: {
    setChart() {
      let option = {
        title: {
          text: "软件测试岗位薪资",
          x: "center",
          top: 0,
          textStyle: {
            color: "#75deef",
            fontSize: 12,
          },
        },
        tooltip: {
          trigger: "item",
        //   formatter: "{b} : {c} ({d}%)",
          backgroundColor: "#11367a",
          textStyle: {
            color: "#6dd0e3",
            fontSize: 10,
          },
        },
        series: [
          {
            type: "pie",
            startAngle: 160,
            // radius: [0, "50%"],
            label: {
              show: true,
              position: "inside",
              fontSize: 10,
            },
            center: ["50%", "60%"],
            data: this.data
          },
        //   {
        //     type: "pie",
        //     startAngle: 160,
        //     radius: ["52%", "72%"],
        //     labelLine: {
        //       lineStyle: {
        //         color: "#444b62",
        //       },
        //       length: 5,
        //       length2: 5,
        //     },
        //     emphasis: {
        //       label: {
        //         color: "#fff",
        //         show: true,
        //       },
        //     },
        //     label: {
        //       position: "outside",
        //       borderRadius: 4,
        //       color: "#fff",
        //       fontSize: 10,
        //       padding: 0,
        //       backgroundColor: "#183566",
        //       formatter: "{b}{c}笔/{d}%",
        //     },
        //     center: ["50%", "60%"],
        //     data: this.data.data1,
        //     itemStyle: {
        //       emphasis: {
        //         shadowBlur: 10,
        //         shadowOffsetX: 0,
        //         shadowColor: "rgba(0, 0, 0, 0.5)",
        //       },
        //     },
        //   },
        ],
      };
      let myChart = this.$echarts(this.$el);

      myChart.clear();
      myChart.resize();
      myChart.setOption(option);
    },
  },
  mounted() {
      // getTestDataBar().then((res1) => {
      //   let res = res1.data
      //   if (res.length > 0) {
      //       this.data = res[1].map(item => ({name: item.xueli,value: item.salary}))
      //       this.setChart();
      //   }
      // });
  },
};
</script>

<style lang="less" scoped>
.barChart {
  width: 100%;
  height: 100%;
}
</style>